<html>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8"> 
<head>
    <title>Cometd chat</title>
    <link rel="stylesheet" type="text/css" href="chat.css">
    <script type="text/javascript" src="../../jquery/json2.js"></script>
    <script type="text/javascript" src="../../jquery/jquery.js"></script>
    <script type="text/javascript" src="../../jquery/jquery.cookie.js"></script>
    <script type="text/javascript" src="../../jquery/jquery.cometd.js"></script>
    <script type="text/javascript" src="jquery-im.js"></script>
    <script type="text/javascript">
        $(document).ready(function()
        {
            im.init();
            
            $("#name").val($.cookie("userName"));
        });
    </script>

</head>
<body>
<h1>im</h1>
<h2 id="my_name"></h2>


<div id="login_panel" style="width:310px; height:50px;border:#CCC 1px dashed;padding:12px">
  用户名：
  <input id="name" type="text"/>
 <button id="login">登录</button>
</div>
<div id="chat" style="width:510px; height:439px;border:#CCC 1px dashed">
<div id="state_panel" style="width:500px; height:20px;border:#CCC 1px dashed;background:#CCC"><button id="close">关闭</button>你正在和<span id="toFriend" ></span>聊天</div>
<div id="showBox" style="width:500px; height:300px;border:#CCC 1px dashed;overflow:auto"></div>
<div style="width:500px; height:100px">
<textarea id="youSay" style="width:450px; height:100px; float:left"></textarea>
<button id="im_send" style="width:50px; height:30px; float:left">发送</button>
<button style="width:50px; height:25px; float:left" id="group_send">群发</button>
<button style="width:50px; height:25px; float:left" id="chat_history">历史记录</button>
</div>
</div>
<div id="fd_panel"  style="width:120px; height:445px;border:#CCC 1px dashed; float:left">
<button id="leave">下线</button>

<div id="friendList" style="width:120px; height:300px;border:#CCC 1px dashed; float:left;overflow:auto">
</div>
<div id="system_info" style="width:120px; height:118px; float:left;overflow:auto"></div>
</div>

<div id="historyPanel"  style="width:500px; height:300px;border:#CCC 1px dashed;overflow:auto">
</div>
</body>
</html>
